<!--
@Auther: Chenmo
@fileName: 青年大学习
@date on 2019/6/12 19:23
@describe: 可自定义背景，头像，网名以及第几季第几期
@QQ: 160594753
 -->

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0">  -->
    <title>青年大学习</title>
    <link rel="stylesheet" href="css/main.css">
</head>

<body>
    <div class="container">
        <!-- header begin -->
        <div class="header">
            <!-- 背景 -->
            <div class="bg-img" id="bg-pre">
                <!-- accept: 可以接受gif,jpeg,png,jpg的格式 -->
                <input type="file" name="bg" id="bg-ipt" value="" accept="image/gif, image/jpeg, image/png, image/jpg">
            </div>
            <!-- 大头像 -->
            <input type="text" name="大网名" value="Kee" class="name name-b" id='nickName-b'>
            <div id="avatar-pre-b">
                <input type="file" name="avatar-b" id="ava-ipt-b" value="" accept="image/gif, image/jpeg, image/png, image/jpg">
            </div>
        </div>

        <!-- mid begin -->
        <div class="mid">
            <div class="line line1"></div>
            <span class="new" id="longPress">朋友的新动态</span>
            <div class="line line2"></div>
        </div>

        <div class="body">
            <!-- 小头像 -->
            <div id="avatar-pre-s">

                <input type="file" name="avatar-s" id="ava-ipt-s" value="" accept="image/gif, image/jpeg, image/png, image/jpg">

            </div>
            <!-- 内容 -->
            <input type="text" name="" value="Kee" class="name name-s" id='nickName-s'><br>
            <!-----
            <div class="tit">
                <textarea rows="1" cols="1" id="mainContent">通信</textarea>
            </div>
            ----->

            <input type="text" name="" value="通信1805高峰" class="name name-self" id='nickName-s'>


            <div class="article">
                <div class="cover"></div>

                <div class="content2">

                    <textarea rows="4" cols="2" id="detailContent">我完成了“青年大学习”网上主题团课第八季第八期的课程，你也来试试吧</textarea>
                </div>
            </div>
            <br>
            <p class="delete" onclick="alert('不可以删除滴哈')"><o>1分钟前</o> &nbsp;<i>删除</i></p>

            <div class="point">
                <span></span>
                <span></span>
            </div>
        </div>
    </div>
    <!-- 模式框 -->
    <div class="modal" id='modal'>
        <div class="zhezhao"></div>
        <div class="tankuang">
            <div id="header">
                <span>说明</span>
            </div>
            <div class="content">
                <ol>
                    <li>本网站是为了懒人们服务的，由于学校经常需要共青团学习的截图，因此，随手做了一个网站，方便大家使用.</li>
                    <li>该网站的背景图和头像是随机生成的，并且支持手机相册上传！</li>
                    <li>网站内所有的文字均支持更改！</li>
                    <li>网站支持本地保存，相册上传的图片和更改的文字将会在本地保存！</li>
                    <li>点击“朋友的新动态”即可清除本地缓存</li>
                </ol>
            </div>
            <div id="header-right" onclick="hidder()">我知道了</div>
        </div>
    </div>

</body>
<script src="js/main.js"></script>

</html>